import QtQuick 2.2

BorderImage {
    id: button

    property alias text: buttonText.text
    property string op
    property alias shiftText: buttonShiftText.text
    property string shiftOp

    property  int db:1
    signal clicked(string op)

    width: 50
    height: 50

    //source: "images/button.png"; clip: true
    border { left: 10; top: 10; right: 10; bottom: 10 }

    Rectangle {
        id: shade
        anchors {fill: button;}
        radius: 10;
        color: "#755A30"
        opacity: db*0.4
    }

    Text {
        id: buttonText
        anchors { centerIn: parent; }
        font.family: "WenQuanYi Micro Hei Mono"
        font.pixelSize: parent.width > parent.height ? parent.height * .5 : parent.width * .5
        style: Text.Sunken;
        color: "black";
        styleColor: "black";
        smooth: true

    }

    Text {
        id: buttonShiftText
        anchors {
            top: parent.top
            right: parent.right
            rightMargin: 8
        }

        font.pixelSize: parent.width > parent.height ? parent.height * .25 : parent.width * .25
      //  style: Text.Sunken;
        color: "white";
        styleColor: "black";
        smooth: true
    }

    MouseArea {
        id: mouseArea
        anchors.fill: parent
        onClicked: button.clicked(op)
    }

    states: State {
       name: "pressed"; when: mouseArea.pressed == true
       PropertyChanges { target: shade; opacity: db*0.2 }
    }
}
